<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
  <!--  <th:block th:include="mall :: mall-css"/>-->
  <meta charset="UTF-8">
  <link rel="shortcut icon" href="favicon.ico">
  <link rel="stylesheet" th:href="@{/mall/css/iconfont.css}">
  <link rel="stylesheet" th:href="@{/mall/css/global.css}">
  <link rel="stylesheet" th:href="@{/mall/css/bootstrap.min.css}">
  <link rel="stylesheet" th:href="@{/mall/css/bootstrap-theme.min.css}">
  <link rel="stylesheet" th:href="@{/mall/css/swiper.min.css}">
  <link rel="stylesheet" th:href="@{/mall/css/styles.css}">
  <script th:href="@{/mall/js/jquery.1.12.4.min.js}" charset="UTF-8"></script>
  <script th:href="@{/mall/js/bootstrap.min.js}" charset="UTF-8"></script>
  <script th:href="@{/mall/js/swiper.min.js}" charset="UTF-8"></script>
  <script th:href="@{/mall/js/global.js}" charset="UTF-8"></script>
  <script th:href="@{/mall/js/jquery.DJMask.2.1.1.js}" charset="UTF-8"></script>
  <title>中维易购商城</title>
</head>
<body>
<!-- 顶部tab -->
<nav th:replace="mall::mall-header"></nav>
<!-- 内页导航栏 -->
<div class="top-nav bg3">
  <div class="nav-box inner">
    <div class="all-cat">
      <div class="title"><i class="iconfont icon-menu"></i> 全部分类</div>
    </div>
    <ul class="nva-list">
      <a th:href="@{/mall/index.html}">
        <li>首页</li>
      </a>
      <a href="">
        <li>企业简介</li>
      </a>
      <a href="temp_article/udai_article5.html">
        <li>新手上路</li>
      </a>
      <a href="class_room.html">
        <li>U袋学堂</li>
      </a>
      <a href="enterprise_id.html">
        <li>企业账号</li>
      </a>
      <a href="udai_contract.html">
        <li>诚信合约</li>
      </a>
      <a href="item_remove.html">
        <li>实时下架</li>
      </a>
    </ul>
  </div>
</div>
<div class="content inner">
  <section class="item-show__div item-show__head clearfix">
    <div class="pull-left">
      <ol class="breadcrumb">
        <li><a href="index.html">首页</a></li>
        <li><a href="item_sale_page.html">爆款推荐</a></li>
        <li class="active" th:text="${product.productName}"></li>
      </ol>
      <div class="item-pic__box" id="magnifier">
        <div class="small-box">
          <img class="cover" th:src="@{${image.imageUrl}}" th:each="image,istat:${product.images}" th:if="${istat.count} < 2"
               th:alt="${product.productName}">
          <span class="hover"></span>
        </div>
        <div class="thumbnail-box">
          <a href="javascript:;" class="btn btn-default btn-prev"></a>
          <div class="thumb-list">
            <ul class="wrapper clearfix">
              <li th:each="image,istat:${product.images}" th:if="${istat.index} == 0" class="item active" th:data-src="@{${image.imageUrl}}"><img class="cover"
                                                                                                          th:src="@{${image.imageUrl}}"
                                                                                                          th:alt="${product.productName}">
              </li>
              <li th:each="image,istat:${product.images}" th:if="${istat.index} != 0" class="item" th:data-src="@{${image.imageUrl}}"><img class="cover"
                                                                                                   th:src="@{${image.imageUrl}}"
                                                                                                   th:alt="${product.productName}">
              </li>
            </ul>
          </div>
          <a href="javascript:;" class="btn btn-default btn-next"></a>
        </div>
        <div class="big-box">
          <img th:src="@{${image.imageUrl}}" th:each="image,istat:${product.images}" th:if="${istat.count} < 2"
               th:alt="${product.productName}">
        </div>
      </div>
      <div class="item-info__box">
        <div class="item-title">
          <div class="name ep2" th:text="${product.productName}"></div>
          <div class="sale cr">优惠活动：该商品享受8折优惠</div>
        </div>
        <div class="item-price bgf5">
          <div class="price-box clearfix">
            <div class="price-panel pull-left">
              售价：<span class="price" th:text="${product.productName}">￥19.20 <s class="fz16 c9">￥24.00</s></span>
            </div>
            <div class="vip-price-panel pull-right">
              会员等级价格 <i class="iconfont icon-down"></i>
              <ul class="all-price__box">
                <!-- 登陆后可见 -->
                <li><span class="text-justify">普通：</span>40.00元</li>
                <li><span class="text-justify">银牌：</span>38.00元</li>
                <li><span class="text-justify">超级：</span>28.00元</li>
                <li><span class="text-justify">V I P：</span>19.20元</li>
              </ul>
            </div>
          </div>
          <!--          <div class="c6">普通会员限购 2 件，想要<u class="cr"><a href="">购买更多</a></u>？</div>-->
        </div>
        <ul class="item-ind-panel clearfix">
          <li class="item-ind-item">
            <span class="ind-label c9">累计销量</span>
            <span class="ind-count cr">1688</span>
          </li>
          <li class="item-ind-item">
            <a href=""><span class="ind-label c9">累计评论</span>
              <span class="ind-count cr">1314</span></a>
          </li>
          <li class="item-ind-item">
            <a href=""><span class="ind-label c9">赠送积分</span>
              <span class="ind-count cg">666</span></a>
          </li>
        </ul>
        <div class="item-key">
          <div class="item-sku">
            <dl class="item-prop clearfix">
              <dt class="item-metatit">颜色：</dt>
              <dd>
                <ul data-property="颜色" class="clearfix">
                  <li><a class="on" href="javascript:;" role="button" data-value="白色" aria-disabled="true">
                    <span>白色</span>
                  </a></li>
                  <li><a href="javascript:;" role="button" data-value="黑色" aria-disabled="true">
                    <span>黑色</span>
                  </a></li>
                  <li><a href="javascript:;" role="button" data-value="粉红色" aria-disabled="true">
                    <span>粉红色</span>
                  </a></li>
                  <li><a href="javascript:;" role="button" data-value="黄色" aria-disabled="true">
                    <span>黄色</span>
                  </a></li>
                </ul>
              </dd>
            </dl>
            <dl class="item-prop clearfix">
              <dt class="item-metatit">尺码：</dt>
              <dd>
                <ul data-property="尺码" class="clearfix">
                  <li><a href="javascript:;" role="button" data-value="S" aria-disabled="true">
                    <span>S</span>
                  </a></li>
                  <li><a href="javascript:;" role="button" data-value="M" aria-disabled="true">
                    <span>M</span>
                  </a></li>
                  <li><a href="javascript:;" role="button" data-value="L" aria-disabled="true">
                    <span>L</span>
                  </a></li>
                  <li><a href="javascript:;" role="button" data-value="XL" aria-disabled="true">
                    <span>XL</span>
                  </a></li>
                </ul>
              </dd>
            </dl>
          </div>
          <div class="item-amount clearfix bgf5">
            <div class="item-metatit">数量：</div>
            <div class="amount-box">
              <div class="amount-widget">
                <input class="amount-input" value="1" maxlength="8" title="请输入购买量" type="text">
                <div class="amount-btn">
                  <a class="amount-but add"></a>
                  <a class="amount-but sub"></a>
                </div>
              </div>
              <div class="item-stock"><span style="margin-left: 10px;">库存 <b id="Stock">1000</b> 件</span></div>

            </div>
          </div>
          <div class="item-action clearfix bgf5">
            <a href="javascript:;" rel="nofollow" data-addfastbuy="true" title="点击此按钮，到下一步确认购买信息。" role="button" class="item-action__buy">立即购买</a>
            <a href="javascript:;" rel="nofollow" data-addfastbuy="true" role="button" class="item-action__basket">
              <i class="iconfont icon-shopcart"></i> 加入购物车
            </a>
          </div>
        </div>
      </div>
    </div>
    <div class="pull-right picked-div">
      <div class="lace-title">
        <span class="c6">爆款推荐</span>
      </div>
      <div class="swiper-container picked-swiper">
        <div class="swiper-wrapper">
          <div class="swiper-slide">
            <a class="picked-item" href="">
              <img src="images/temp/S-001-1_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
            <a class="picked-item" href="">
              <img src="images/temp/S-001-2_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
            <a class="picked-item" href="">
              <img src="images/temp/S-001-3_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
          </div>
          <div class="swiper-slide">
            <a class="picked-item" href="">
              <img src="images/temp/S-001-4_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
            <a class="picked-item" href="">
              <img src="images/temp/S-001-5_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
            <a class="picked-item" href="">
              <img src="images/temp/S-001-6_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
          </div>
          <div class="swiper-slide">
            <a class="picked-item" href="">
              <img src="images/temp/S-001-7_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
            <a class="picked-item" href="">
              <img src="images/temp/S-001-8_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
            <a class="picked-item" href="">
              <img src="images/temp/S-001-9_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
          </div>
          <div class="swiper-slide">
            <a class="picked-item" href="">
              <img src="images/temp/S-001-10_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
            <a class="picked-item" href="">
              <img src="images/temp/S-001-1_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
            <a class="picked-item" href="">
              <img src="images/temp/S-001-2_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
          </div>
          <div class="swiper-slide">
            <a class="picked-item" href="">
              <img src="images/temp/S-001-3_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
            <a class="picked-item" href="">
              <img src="images/temp/S-001-4_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
            <a class="picked-item" href="">
              <img src="images/temp/S-001-5_s.jpg" alt="" class="cover">
              <div class="look_price">¥134.99</div>
            </a>
          </div>
        </div>
      </div>
      <div class="picked-button-prev"></div>
      <div class="picked-button-next"></div>
    </div>
  </section>
  <section class="item-show__div item-show__body posr clearfix">
    <div class="item-nav-tabs">
      <ul class="nav-tabs nav-pills clearfix" role="tablist" id="item-tabs">
        <li role="presentation" class="active"><a href="#detail" role="tab" data-toggle="tab" aria-controls="detail" aria-expanded="true">商品详情</a>
        </li>
        <li role="presentation"><a href="#service" role="tab" data-toggle="tab" aria-controls="service">售后服务</a></li>
      </ul>
    </div>
    <div class="pull-left">
      <div class="tab-content">
        <div role="tabpanel" class="tab-pane fade in active" id="detail" aria-labelledby="detail-tab">
          <div class="item-detail__info clearfix">
            <div class="record">商品编号：D-8812</div>
            <div class="record">上架时间：2017-06-24</div>
            <div class="record">商品毛重：200克</div>
            <div class="record">商品库存：1000件</div>
          </div>
          <div class="rich-text">
            <p style="text-align: center;">
              <i id="desc-module-1" style="font-size: 0"></i>

              <img src="images/temp/S-001_1.jpg" alt=""><br><img src="images/temp/S-001_2.jpg" alt=""><br>

              <i id="desc-module-2" style="font-size: 0"></i><img src="images/temp/S-001_3.jpg" alt=""><br><img
                src="images/temp/S-001_4.jpg" alt=""><br><img src="images/temp/S-001_5.jpg" alt=""><br><img src="images/temp/S-001_6.jpg"
                                                                                                            alt=""><br><img
                src="images/temp/S-001_7.jpg" alt=""><br><img src="images/temp/S-001_8.jpg" alt=""><br>

              <i id="desc-module-3" style="font-size: 0"></i><img src="images/temp/S-001_9.jpg" alt=""><br><img
                src="images/temp/S-001_10.jpg" alt=""><br><img src="images/temp/S-001_11.jpg" alt=""><br><img src="images/temp/S-001_12.jpg"
                                                                                                              alt=""><br>

              <i id="desc-module-4" style="font-size: 0"></i><img src="images/temp/S-001_13.jpg" alt=""><br><img
                src="images/temp/S-001_14.jpg" alt=""><br><img src="images/temp/S-001_15.jpg" alt=""><br><img src="images/temp/S-001_16.jpg"
                                                                                                              alt=""><br><img
                src="images/temp/S-001_17.jpg" alt=""><br><img src="images/temp/S-001_18.jpg" alt=""><br><img src="images/temp/S-001_19.jpg"
                                                                                                              alt=""><br><img
                src="images/temp/S-001_20.jpg" alt=""><br><img src="images/temp/S-001_21.jpg" alt=""><br><img src="images/temp/S-001_22.jpg"
                                                                                                              alt=""><br><img
                src="images/temp/S-001_23.jpg" alt=""><br><img src="images/temp/S-001_24.jpg" alt=""><br><img src="images/temp/S-001_25.jpg"
                                                                                                              alt=""><br><img
                src="images/temp/S-001_26.jpg" alt=""><br><img src="images/temp/S-001_27.jpg" alt=""><br><img src="images/temp/S-001_28.jpg"
                                                                                                              alt=""><br><img
                src="images/temp/S-001_29.jpg" alt=""><br><img src="images/temp/S-001_30.jpg" alt=""><br><img src="images/temp/S-001_31.jpg"
                                                                                                              alt=""><br><img
                src="images/temp/S-001_32.jpg" alt=""><br><img src="images/temp/S-001_33.jpg" alt=""><br><img src="images/temp/S-001_34.jpg"
                                                                                                              alt=""><br><img
                src="images/temp/S-001_35.jpg" alt=""><br><img src="images/temp/S-001_36.jpg" alt=""><br>

              <i id="desc-module-5" style="font-size: 0"></i><img src="images/temp/S-001_37.jpg" alt=""><br><img
                src="images/temp/S-001_38.jpg" alt=""><br><img src="images/temp/S-001_39.jpg" alt=""><br><img src="images/temp/S-001_40.jpg"
                                                                                                              alt=""><br><img
                src="images/temp/S-001_41.png" width="790" alt="">
            </p>
          </div>
        </div>
        <div role="tabpanel" class="tab-pane fade" id="service" aria-labelledby="service-tab">
          <!-- 富文本 -->
          <div class="service-content rich-text">
            <img title="" alt="" src="http://img.aocmonitor.com.cn/image/2014-06/86575417.gif" width="240" height="160" border="0"
                 align="left">
            <p>承蒙惠购 AOC 产品，谨致谢意！为了让您更好地使用本产品，武汉艾德蒙科技股份有限公司通过该产品随机附带的保修证向您做出下述维修服务承诺，并按照该服务的承诺向您提供维修服务。</p>
            <p>这些服务承诺仅适用于2016年6月1日（含）之后销售的AOC品牌显示器标准品。</p>
            <p>如果您选择购买了 AOC 显示器扩展功能模块或其它厂家电脑主机，其保修承诺请参见相应产品的保修卡。</p>
            <p>所有承诺内容以产品附件的保修卡为准。</p>
            <p><br></p>
            <h3>一、全国联保</h3>
            <p style="text-indent:2em">AOC 显示器实施全国范围联保，国家标准三包服务。无论您是在中国大陆 ( 不含香港、澳门、台湾地区) 何处购买并在大陆地区使用的显示器，出现三包范围内的故障时，可凭显示器的保修证正本和购机发票到 AOC
              显示器维修网点或授权网点进行维修同时，也欢迎您关注官方微信服务号“AOC用户俱乐部”(微信号：aocdisplay)进行查询。</p>
            <div style="text-align:center"><img src="http://img.aocmonitor.com.cn/image/2017-05/89154415.jpg" alt=""></div>
            <p><br></p>
            <p>三包服务如下：</p>
            <ol>
              <li>商品自售出之日起 7 日内，出现《微型计算机商品性能故障表》中所列故障时，消费者可选择退货、换货或修理。</li>
              <li>商品自售出之日起 15 日内，出现《微型计算机商品性能故障表》中所列故障时，消费者可选择换货或修理。</li>
              <li>商品自售出之日起 1 年内，出现《微型计算机商品性能故障表》中所列故障时，消费者可选择修理。</li>
            </ol>
            <p>以下情况不在三包范围内：</p>
            <ol>
              <li>超过三包有效期。</li>
              <li>无有效的三包凭证及发票。</li>
              <li>发票上内容与商品实物标识不符或者涂改的。</li>
              <li>未按产品使用说明书要求使用、维护、保养而造成损坏的（人为损坏）。</li>
              <li>非 AOC 授权的修理者拆动造成损坏的（私自拆修）。</li>
              <li>非 AOC 在中国大陆（不含香港、澳门、台湾地区）销售的商品。</li>
            </ol>
            <h3>二、显示器专享服务</h3>
            <p><strong>1、LUVIA视界头等舱，VIP专享服务</strong></p>
            <p style="text-indent:2em">
              AOC针对各省市地区采取指定商品销售，消费者购买指定销往该区域的LUVIA卢瓦尔显示器标准品，从发票开具之日起1年内，注册成为官方微信服务号“AOC用户俱乐部”(微信号：aocdisplay)产品会员，即可在当地享“LUVIA视界头等舱，VIP专享服务”。</p>
            <div style="text-align:center"><img src="http://img.aocmonitor.com.cn/image/2017-05/25352146.jpg" alt=""></div>
            <p><br></p>
            <p style="text-indent:2em">* 如客户未在发票开具之日起1年内注册AOC微信会员，则只享受国家三包服务。</p>
            <p style="text-indent:2em">注册会员方式：1、关注“AOC用户俱乐部”微信公众号。2、点击“会员”→“注册会员”。3、填写个人真实信息并注册产品信息，即可成为AOC产品会员。</p>
            <p style="text-indent:2em"><strong>3年免费上门更换</strong>：从发票开具之日起3年内，产品若发生《微型计算机商品性能故障表》所列性能故障，可免费更换不低于同型号同规格产品。（服务网点无法覆盖区域，全国区域免费邮寄，双向运费由AOC负担）
            </p>
            <p style="text-indent:2em"><strong>一键快捷掌上服务：</strong>从注册成为“AOC用户俱乐部”会员之日起，可享在线贴身技术顾问有问必答、售后服务在线预约、服务网点在线查询等一键快捷掌上服务。（人工客服咨询在线时间：8:00-22:00）
            </p>
            <p style="text-indent:2em"><strong>增值豪礼尊享服务：</strong>可参加“AOC用户俱乐部”有奖互动赢取豪礼。</p>
            <p>注：<br>(1)如不能及时提供购机发票或发票记载不清、涂改、商品实物标示和发票内容不符，将以您上传“AOC用户俱乐部”的发票信息为准计算保修时间；如果发票信息并未上传，将以该显示器制造日期(制造日期见显示器后壳条形码标签)加一个月为准计算保修时间。<br>(2)非“AOC用户俱乐部”产品会员，不享受“LUVIA视界头等舱，VIP专享服务”。
            </p>
          </div>
        </div>
      </div>

    </div>
    <div class="pull-right">
      <div class="tab-content" id="descCate">
        <div role="tabpanel" class="tab-pane fade in active" id="detail-tab" aria-labelledby="detail-tab">
          <div class="descCate-content bgf5">
            <dd class="dc-idsItem selected">
              <a href="#desc-module-1"><i class="iconfont icon-dot"></i> 产品图</a>
            </dd>
            <dd class="dc-idsItem">
              <a href="#desc-module-2"><i class="iconfont icon-selected"></i> 细节图</a>
            </dd>
            <dd class="dc-idsItem">
              <a href="#desc-module-3"><i class="iconfont"></i> 尺寸及试穿</a>
            </dd>
            <dd class="dc-idsItem">
              <a href="#desc-module-4"><i class="iconfont"></i> 模特效果图</a>
            </dd>
            <dd class="dc-idsItem">
              <a href="#desc-module-5"><i class="iconfont"></i> 常见问题</a>
            </dd>
          </div>
        </div>
        <div role="tabpanel" class="tab-pane fade" id="evaluate-tab" aria-labelledby="evaluate-tab">
          <div class="descCate-content posr bgf5">
            <div class="lace-title">
              <span class="c6">相关推荐</span>
            </div>
            <div class="picked-box">
              <a class="picked-item" href="">
                <img src="images/temp/S-001-1_s.jpg" class="cover">
                <div class="look_price">¥134.99</div>
              </a>
              <a class="picked-item" href="">
                <img src="images/temp/S-001-2_s.jpg" class="cover">
                <div class="look_price">¥134.99</div>
              </a>
              <a class="picked-item" href="">
                <img src="images/temp/S-001-3_s.jpg" class="cover">
                <div class="look_price">¥134.99</div>
              </a>
              <a class="picked-item" href="">
                <img src="images/temp/S-001-4_s.jpg" class="cover">
                <div class="look_price">¥134.99</div>
              </a>
              <a class="picked-item" href="">
                <img src="images/temp/S-001-5_s.jpg" class="cover">
                <div class="look_price">¥134.99</div>
              </a>
            </div>
          </div>
        </div>
        <div role="tabpanel" class="tab-pane fade" id="service-tab" aria-labelledby="service-tab">
          <div class="descCate-content posr bgf5">
            <div class="lace-title">
              <span class="c6">最近浏览</span>
            </div>
            <div class="picked-box">
              <a class="picked-item" href="">
                <img src="images/temp/S-001-1_s.jpg" class="cover">
                <div class="look_price">¥134.99</div>
              </a>
              <a class="picked-item" href="">
                <img src="images/temp/S-001-2_s.jpg" class="cover">
                <div class="look_price">¥134.99</div>
              </a>
              <a class="picked-item" href="">
                <img src="images/temp/S-001-3_s.jpg" class="cover">
                <div class="look_price">¥134.99</div>
              </a>
              <a class="picked-item" href="">
                <img src="images/temp/S-001-4_s.jpg" class="cover">
                <div class="look_price">¥134.99</div>
              </a>
              <a class="picked-item" href="">
                <img src="images/temp/S-001-5_s.jpg" class="cover">
                <div class="look_price">¥134.99</div>
              </a>
            </div>
          </div>
        </div>
      </div>
    </div>

  </section>
</div>
<!-- 右侧菜单 -->
<div class="right-nav">
  <ul class="r-with-gotop">
    <li class="r-toolbar-item">
      <a href="udai_welcome.html" class="r-item-hd">
        <i class="iconfont icon-user" data-badge="0"></i>
        <div class="r-tip__box"><span class="r-tip-text">用户中心</span></div>
      </a>
    </li>
    <li class="r-toolbar-item">
      <a href="udai_shopcart.html" class="r-item-hd">
        <i class="iconfont icon-cart"></i>
        <div class="r-tip__box"><span class="r-tip-text">购物车</span></div>
      </a>
    </li>
    <li class="r-toolbar-item">
      <a href="udai_collection.html" class="r-item-hd">
        <i class="iconfont icon-aixin"></i>
        <div class="r-tip__box"><span class="r-tip-text">我的收藏</span></div>
      </a>
    </li>
    <li class="r-toolbar-item">
      <a href="" class="r-item-hd">
        <i class="iconfont icon-liaotian"></i>
        <div class="r-tip__box"><span class="r-tip-text">联系客服</span></div>
      </a>
    </li>
    <li class="r-toolbar-item">
      <a href="issues.html" class="r-item-hd">
        <i class="iconfont icon-liuyan"></i>
        <div class="r-tip__box"><span class="r-tip-text">留言反馈</span></div>
      </a>
    </li>
    <li class="r-toolbar-item to-top">
      <i class="iconfont icon-top"></i>
      <div class="r-tip__box"><span class="r-tip-text">返回顶部</span></div>
    </li>
  </ul>
</div>
<!-- 底部信息 -->
<nav th:replace="mall::mall-footer"></nav>
<th:block th:include="mall :: mall-js"/>
<script type="text/javascript">
  $(function () {
    $('#magnifier').magnifier();

    // 会员价格折叠展开
    $('.vip-price-panel').click(function () {
      if ($(this).hasClass('active')) {
        $('.all-price__box').stop().slideUp('normal', function () {
          $('.vip-price-panel').removeClass('active').find('.iconfont').removeClass('icon-up').addClass('icon-down');
        });
      } else {
        $(this).addClass('active').find('.iconfont').removeClass('icon-down').addClass('icon-up');
        $('.all-price__box').stop().slideDown('normal');
      }
    });

    $('.amount-input').onlyReg({reg: /[^0-9]/g});
    var stock = parseInt($('#Stock').html());
    $('.amount-widget').on('click', '.amount-but', function () {
      var num = parseInt($('.amount-input').val());
      if (!num) {
        num = 0;
      }
      if ($(this).hasClass('add')) {
        if (num > stock - 1) {
          return DJMask.open({
            width: "300px",
            height: "100px",
            content: "您输入的数量超过库存上限"
          });
        }
        $('.amount-input').val(num + 1);
      } else if ($(this).hasClass('sub')) {
        if (num == 1) {
          return DJMask.open({
            width: "300px",
            height: "100px",
            content: "您输入的数量有误"
          });
        }
        $('.amount-input').val(num - 1);
      }
    });
  });

  $(document).ready(function () {

    // 顶部banner轮播
    var picked_swiper = new Swiper('.picked-swiper', {
      loop: true,
      direction: 'vertical',
      prevButton: '.picked-button-prev',
      nextButton: '.picked-button-next',
    });

    var recommends = new Swiper('.recommends-swiper', {
      spaceBetween: 40,
      autoplay: 5000,
    });

    $('#descCate').smartFloat(0);
    $('.dc-idsItem').click(function () {
      $(this).addClass('selected').siblings().removeClass('selected');
    });
    $('#item-tabs a[data-toggle="tab"]').on('show.bs.tab', function (e) {
      $('#descCate #' + $(e.target).attr('aria-controls') + '-tab')
      .addClass('in').addClass('active').siblings()
      .removeClass('in').removeClass('active');
    });

    $('.to-top').toTop({position: false});

  });

</script>
</body>
</html>